import axios from 'axios';
import { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios';

import i18n from '@/locales/i18n';
import { userProxy } from '@/store/userStore';

import messageBox from './messageBox';

export type AllowedMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';

// 请求实例
const requestInstance = axios.create({ timeout: 10000 });

// 请求头增加参数token参数
requestInstance.interceptors.request.use(
  (config: AxiosRequestConfig) => {
    if (config.headers && !config.headers['Authorization']) {
      config.headers['Authorization'] = `Bearer ${userProxy.token}`;
    }
    return config;
  },
  (error: AxiosError) => {
    messageBox.error({ content: `Request Error: ${error.message}` });
    return Promise.reject(error);
  },
);

// 响应体状态正常如果返回了用户状态则改变用户状态，如果状态异常则报错
requestInstance.interceptors.response.use(
  (res: AxiosResponse) => Promise.resolve<AxiosResponse>(res),
  (error: AxiosError<any>) => {
    if (error.response) {
      // 请求成功发出且服务器也响应了状态码，但状态代码超出了 2xx 的范围
      messageBox.error({ content: i18n.t(error.response.data.error) });
    } else if (error.request) {
      // 请求已经成功发起，但没有收到响应
      messageBox.error({ content: i18n.t('Unreachable') });
    } else {
      // 其他错误
      messageBox.error({ content: i18n.t('UnknownError') });
    }
    return Promise.reject(error);
  },
);

// 请求方法
const request = async (method: AllowedMethod, url: string, params?: object) =>
  await requestInstance({
    method,
    url,
    params: method === 'GET' ? params : undefined,
    data: method !== 'GET' ? params : undefined,
  });

export { request, requestInstance };
